//保存的uuid的值 
var uuid;
  
$(function() {

	fetchData();

	//对某些按钮做事件
	buttonHandler();

});

//拉取数据
function fetchData() {

	//https://www.cnblogs.com/marixh/p/12027654.html
	$("#tb").bootstrapTable({
		clickToSelect: true,
		method: 'get',
		url: 'http://localhost:8080/api/role/data',
		sidePagination: 'server',
		queryParamsType: 'limit', //不要叫limit(后台参数offset 和 limit)
		pagination: true, //要分页 
		pageNumber: 1, //当前是第几页
		pageSize: 10, //每页显示1笔
		pageList: [5, 10, 25, 50, 100],
		queryParams: function(params) {
			//自定义参数
			params["roleName"] = $("#roleName").val();
			return params;
		},
		responseHandler: function(resp) {
			console.log(resp);
			if (resp.code === 0) {
				return resp.data;
			} else {
				alert(resp.message);
				return [];
			}
		},
		columns: [ 
			{
				title: '编号',
				field: 'id',
				sortable: true
			},
			{
				title: '角色名称',
				field: 'roleName',
				sortable: true,
				formatter: nameFormat
			},
			{
				title: '角色备注',
				field: 'roleRemark'
			},
			{
				title: '操作',
				formatter: editTempalte
			},
		]

	});

}


/**
 * 某格的数据转换函数，需要三个参数： 
 * @param {Object} value field（字段名）
 * @param {Object} row    行的数据 
 * @param {Object} index 行的（索引）
 */
function nameFormat(value, row, index) {
	let vl = value.trim();
	//把第2个字替换成*
	if (vl.length === 2) {
		return vl.substring(0, 1) + "*";
	} else {
		return vl.substring(0, 1) + "*" + vl.substring(2);
	}
}

function editTempalte(value, row, index) { 
	return `<button type="button" class="btn btn-success edit" onclick="editForm(${index})">编辑</button>
			 <button type="button" class="btn btn-danger delete" onclick="deleteForm(${index})">删除</button>`;
}


function buttonHandler() {

	$("#btnSearch").click(searchEvent);

	//新增按钮
	$("#btnAdd").click(addEditForm);

	//保存按钮
	$("#btnSave").click(saveForm);

}

//查询事件
function searchEvent() {
	//显示第1页，重新传查询条件
	$("#tb").bootstrapTable('refresh', {
		pageNumber: 1
	});
}

//新增按钮，显示模态框
function addEditForm() {
	
	uuid=undefined;
	$("#edit_roleName").val('');
	$("#edit_roleRemark").val('');
	
	$("#editDialog").modal({
		backdrop: 'static',
		show: true
	});
}


function editForm(index){
	 console.log(index);
	 let data=$("#tb").bootstrapTable('getData');
	 
	 let row=data[index];
	 $("#edit_roleName").val(row.roleName);
	 $("#edit_roleRemark").val(row.roleRemark);
	 uuid=row.uuid;
	 
	 $("#editDialog").modal({
	 	backdrop: 'static',
	 	show: true
	 });
	 
}

//删除
function deleteForm(index){
	
}

function saveForm() {
 
	console.log("自动收集数据，叫做  序列化------");
	let params2 = $("#editForm").serialize();
	 
	let url='http://localhost:8080/api/role/add';
	//我们认为是修改操作
	if(uuid){
		params2=params2+`&uuid=${uuid}`;
		url="http://localhost:8080/api/role/update";
	}
     console.log(params2);

	//向后台提交数据
	$.ajax({
		type: "post",
		url: url,
		data: params2, //变为  roleName=?&roleRemarke=?
		dataType: "json",
		success: function(resp) {
			console.log(resp);
			if (resp.code === 0) {
				//隐藏模态框
				$("#editDialog").modal('hide');
				 searchEvent();
			} else {
				alert(resp.message);
			}
		}
	});

}
